<template>
	<view>
		<!-- 		<view style="width: 100%; ">
			<u--image src="/static/bg_login.png" ></u--image>
		</view> -->
		<u--text text="邀请码" :bold="true" customStyle="margin: 50px 0px 0px 50rpx"></u--text>
		<u--input v-model="yqCodeValue" customStyle="margin: 10px 50px 0px 50rpx" placeholder="请输入您的邀请码" border="bottom"
			clearable>
		</u--input>

		<u--text text="手机号" :bold="true" customStyle="margin: 30px 0px 0px 50rpx"></u--text>
		<u--input v-model="nameValue" customStyle="margin: 10px 50px 0px 50rpx" placeholder="请输入您的手机号" border="bottom"
			clearable>
		</u--input>

		<u--text text="密码" :bold="true" customStyle="margin: 30px 0px 0px 50rpx"></u--text>
		<u--input v-model="pwdValue" customStyle="margin: 10px 50px 0px 50rpx" placeholder="请输入您的密码" border="bottom"
			clearable>
		</u--input>


		<u--text v-if="0" text="验证码" :bold="true" customStyle="margin: 30px 0px 0px 50rpx"></u--text>

		<view v-if="0" style="display: flex; ">
			<u--input v-model="phoneCodeValue" customStyle="margin: 10px -100rpx 0px 50rpx" placeholder="请输入您的验证码"
				border="bottom">
				<!-- 			<template slot="suffix">
							<u-code ref="uCode" @change="codeChange" seconds="20" changeText="X秒重新获取哈哈哈"></u-code>
							<u-button @tap="getCode" text="获取验证码" type="primary" size="mini"></u-button>
						</template> -->



			</u--input>

			<view  style="margin-right: 50rpx;">
				<u-code ref="uCode" @change="codeChange" seconds="60" changeText="X秒后重试"></u-code>
				<u-button @tap="getCode" :text="tips" type="primary" size="mini"></u-button>
			</view>
		</view>

		<view>
			<u-button @click="register()" class="custom-style" type="primary" text="注册"></u-button>
		</view>
		<view v-if="0">
			<u-button class="custom-style-register" type="info" text="下载App" @click="clickDownload()"></u-button>
		</view>


		<u-modal :show="showDownload" :showCancelButton="true" @cancel="dealDialog(0)" @confirm="dealDialog(1)"
			title="App下载" content='是否下载App?'></u-modal>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tips: '获取验证码',
				value: '',
				nameValue: '',
				yqCodeValue: '',
				phoneCodeValue: '',
				pwdValue: '',
				showDownload: false,
			}
		},
		watch: {
			value(newValue, oldValue) {
				// console.log('v-model', newValue);
			}
		},
		onLoad(options) {
			console.log("onLoad", options.promotionCode)
			// uni.$u.toast(options.promotionCode);
			if (options.promotionCode == null || options.promotionCode == undefined) {
				return
			}
			this.yqCodeValue = options.promotionCode;
		},
		methods: {
			codeChange(ctext) {
				if (ctext == null || ctext == undefined) {
					return
				}
				console.log("codeChange", "ctext=" + ctext)
				this.tips = ctext
			},
			getCode() {
				if (this.nameValue == '') {
					uni.$u.toast('手机号不能为空');
					return
				}

				if (this.$refs.uCode.canGetCode) {
					let param = {
						userPhone: this.nameValue,
					}

					// 模拟向后端请求验证码
					uni.showLoading({
						title: '正在获取验证码'
					})
					this.$u.api.apiGetPhoneCode(param).then(res => {
						if (res.code == 1) {
							uni.hideLoading();
							// 这里此提示会被this.start()方法中的提示覆盖
							uni.$u.toast('验证码已发送');
							// 通知验证码组件内部开始倒计时
							this.$refs.uCode.start();
						} else {
							uni.$u.toast(res.data.msg);
						}
					})

				} else {
					uni.$u.toast('倒计时结束后再发送');
				}
			},
			change(e) {
				console.log('change', e);
			},
			register() {
				let param = {
					userPhone: this.nameValue,
					password: this.pwdValue,
					// phoneCode: this.phoneCodeValue,
					invitationCode: this.yqCodeValue,
				}

				uni.showLoading({
					title: '请求中...'
				})
				this.$u.api.apiRegister(param).then(res => {
					console.log('apiRegister', res);
					uni.hideLoading();
					if (res.code == 1) {
						// 这里此提示会被this.start()方法中的提示覆盖
						this.$u.toast('注册成功!');
						// 通知验证码组件内部开始倒计时
						// this.showDownLoadDialog();
						this.$u.route({
							url: 'pages/login/login',
						})
					} else {
						this.$u.toast(res.msg);
						// this.showDownLoadDialog();
					}
				})
			},
			showDownLoadDialog() {
				this.showDownload = true;
			},
			dealDialog(type) {
				this.showDownload = false;
				if (type == 1) {
					uni.$u.route({
						url: 'pages/mine/download',
					})
				} else {
					uni.$u.route({
						url: 'pages/login/login',
					})
				}
			},
			clickDownload() {
				uni.$u.route({
					url: 'pages/mine/download',
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.custom-style {
		width: 80%;
		margin-top: 100rpx;
	}

	.custom-style-register {
		width: 80%;
		margin-top: 50rpx;
	}
</style>